<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no"/>
    <link rel="stylesheet" href="css/index.css">
    <title>员工主页</title>
</head>
<body>
<article>
    <header class="nav border-bottom">
        <span class="left-btn">
            <span class="icon icon-back"></span>
        </span>
        <h1>
            人才评估
        </h1>
    </header>

    <section class="main">
        <section class="main-body">
        <!--自我评估-->
        <div class="self">
            <span>自我评估</span>
            <!--状态：未开始(status-before)、进行中(status-active)、已评完显示测评总分数(status-finished)-->
            <span class="status status-before">未开始</span>
        </div>
        <!--同级评估-->
        <div class="group-container collapse on">
            <div class="title">
                <span>同级评估</span>
                <span class="icon icon-back"></span>
            </div>
            <ul class="content member-list">
                <li>
                    <div class="avatar" style="background-image: url('images/avatar.jpg');"></div>
                    <span>张三三</span>
                    <span class="status status-before">未开始</span>
                </li>
                <li>
                    <div class="avatar" style="background-image: url('images/avatar.jpg');"></div>
                    <span>李四四</span>
                    <span class="status status-active">进行中</span>
                </li>
                <li>
                    <div class="avatar" style="background-image: url('images/avatar.jpg');"></div>
                    <span>周五五</span>
                    <span class="status status-finished">90</span>
                </li>
            </ul>
        </div>
        <!--组员评估-->
        <div class="group-container collapse on">
            <div class="title">
                <span>组员评估</span>
                <span class="icon icon-back"></span>
            </div>
            <ul class="content member-list">
                <li>
                    <div class="avatar" style="background-image: url('images/avatar.jpg');"></div>
                    <span>张三三</span>
                    <span class="status status-before">未开始</span>
                </li>
                <li>
                    <div class="avatar" style="background-image: url('images/avatar.jpg');"></div>
                    <span>李四四</span>
                    <span class="status status-active">进行中</span>
                </li>
                <li>
                    <div class="avatar" style="background-image: url('images/avatar.jpg');"></div>
                    <span>周五五</span>
                    <span class="status status-finished">90</span>
                </li>
            </ul>
        </div>
    </section>
    </section>
    <footer>

    </footer>
</article>
</body>
</html>